<!-- 招生方案详情 -->
<template>
	<zh-app style="background-color: #FFFFFF;font-family: '阿里巴巴普惠体'">
		<!-- 导航栏 -->
		<zh-navbar :title="data.title" color="#85a5ff" linear="right" :hideHome="true"/>
		<zh-result v-if="data.loading" :showBtn="false" title="请稍后" subTitle="数据加载中"></zh-result>
		<!-- 标题头 -->
		<view v-if="data.article.articleContent">
		<view class="box flex-vertical">
			<view class="box-item" style="font-size: 36rpx;">{{ data.article.title }}</view>
			<view class="box-item flex-bothends">
				<view class="info">{{ data.article.schoolName }}</view>
				<view class="info">{{ data.showCount }}阅读</view>
				<view class="info">{{ data.article.publishTimeText }}</view>
			</view>
		</view>
		<!-- 方案主体 -->
		<zh-more v-show="data.article.articleContent" :height="800">
			<zh-html :content="data.article.articleContent" style="padding: 20rpx;" :selectable="true" />
		</zh-more>
		</view>
		<zh-result v-if="!data.loading&&!data.article.articleContent" status="warning" color="amber" :showBtn="false" title="无内容" subTitle="该公告信息已下架"></zh-result>
	</zh-app>
</template>
<script lang="ts" setup>
	import {reactive} from "vue";
	import {
		onLoad
	} from "@dcloudio/uni-app";
	// ------------------接收传入参数(组件)-------------------
	

	// ------------------钩子函数----------------------------
	// 初始化
	onLoad((options: any) => {
		if(options.enrollmenBrochureId){
			data.enrollmenBrochureId=options.enrollmenBrochureId
			getDetail();
		}
	})

	// ------------------变量区------------------------------
	// 主数据
	const data = reactive({
		// 方案信息
		article:{} as any,
		enrollmenBrochureId:null,
		title:'招生方案详情',
		loading:true,
		showCount:0,
		showFlag:false,
		stuArr:[],
		error:{} as any,
		showError:false,
		
	})

	// ------------------方法区------------------------------
	// 获取招生方案
	// 获取详情
	const getDetail = () => {
		data.loading=true
		const params: any = {
			enrollmenBrochureId: data.enrollmenBrochureId
		}
		$api.common.send.post("Eduenrollmen0002", params).then((res: any) => {
			data.article = res.result||{};
			data.showCount=data.article.showCount||0
			if(data.article.articleId){
				saveRead(data.article.articleId);
			}
			
			data.loading=false
		}).catch(()=>{
			data.loading=false
		})
	}
	const saveRead=(articleId :number)=>{
		//记录阅读
		setTimeout(() => {
			const params: any = {
				articleId: articleId
			}
			$api.common.send.post("article0013", params).then((res: any) => {
				data.showCount=data.showCount+1
			}).catch(()=>{
				
			})
		}, 100);
	}
	// 跳转至报名页
	const goToEnroll = () => {
		if(data.article.schoolCategory==='1' ){
			$router.push('/pages/edu/nurseryEnroll/nurseryEnroll',{schoolId:data.article.schoolId})
		}else{
			bmYw()
		}
		
	}
	const bmYw = () => {
		const params={schoolCategory:data.article.schoolCategory}
		$api.common.send.post("eduStudentEnroll0023", params).then((res: any) => {
			data.stuArr=res.result
			data.showFlag=true
			
		}).catch((err:any)=>{
			openError(err)
			
		})
	}
	const gotoBm=(item: any, index: number)=>{
		$router.push('/pages/edu/enroll/yjbmList',{studentEnrollPreId:item.studentEnrollPreId,schoolId:data.article.schoolId})
	}
	const openError=(error:any)=> {
		data.error=error
		if(error.code>0){
			data.showError=true
		}	
	}
	const onOk=()=>{
		data.showError=false
		if(data.error.code===2){
			//前往我的报名
			$router.replace('/pages/edu/enroll/myEnroll',{})
		}else if(data.error.code===3){
			//前往准新生登记
			$router.replace('/pages/edu/newStuRegister/newStuRegister',{})
		}
	}
	const onCancel=()=>{
		//关闭页面
		data.showError=false
	}
</script>
<style scoped>
	.box {
		width: 750rpx;
		padding-top: 20rpx;
	}

	.box-item {
		width: 94%;
	}

	.info {
		color: #909399;
		font-size: 26rpx;
		line-height: 50rpx;
	}

	.comment {
		width: 750rpx;
		height: 80rpx;
		margin-top: 40rpx;
		position: relative;
	}

	.comment-text {
		width: 60%;
		height: 100%;
		margin-right: 40rpx;
		position: absolute;
		left: 40rpx;
	}

	.comment-icon {
		width: 28%;
		height: 100%;
		position: absolute;
		right: 40rpx;
	}

	.icon-item {
		width: 25%;
		height: 100%;
		margin-top: 16rpx;
	}

	.explain {
		width: 750rpx;
		margin: 40rpx 0 120rpx 0;
		background-color: #FFFFFF;
	}

	.explain p {
		text-align: center;
		color: #909399;
		font-size: 12rpx;
		margin: 10rpx;
	}
	.btn {
		width: 700rpx;
		position: fixed;
		bottom: 0rpx;
	}
</style>
